import {createApp} from 'vue'
import App from './App.vue'
// element-ui适用于Vue 2
// import {Button, Message, MessageBox} from 'element-ui'
// import 'element-ui/lib/theme-chalk/index.css'
import {ElButton, ElMessage, ElMessageBox, ElCheckbox, ElDivider } from 'element-plus'
import 'element-plus/dist/index.css'
// vue2写法
// import VueRouter from 'vue-router'
import { createRouter, createWebHistory } from 'vue-router'

import http from 'axios'
import './api/mock.js'

const routers = [
  {
    path: '/',
    name: 'main',
    // component: App
    component: () => import ('./views/home')
  },
  {
    path: '/manual',
    name: 'manual',
    component: () => import ('./views/manual')
  }
]

const router = new createRouter({
  history: createWebHistory('/play/'),
  routes: routers
})

const app = createApp(App).use(router)
// Vue 2.0写法
// Vue.component(Button.name, Button)
// Vue 3.0写法
app.use(ElButton)
app.use(ElCheckbox)
app.use(ElDivider)

// Vue 2.0写法 Vue.prototype.$http = http
// Vue 3.0写法
app.config.globalProperties.$http = http
app.config.globalProperties.$message = ElMessage
app.config.globalProperties.$confirm = ElMessageBox.confirm

app.mount('#app')
